<template>
    <div class="showjob-color">
        <el-tabs type="border-card" class="showjob">
            <el-tab-pane label="智能匹配"></el-tab-pane>
            <el-tab-pane label="薪资最高"></el-tab-pane>
            <el-tab-pane label="最新发布"></el-tab-pane>
            <el-table
                    ref="multipleTable"
                    :data="tableData"
                    tooltip-effect="dark"
                    @selection-change="handleSelectionChange"
                    style="width: 100%">
                <el-table-column
                        type="selection"
                        width="55">
                </el-table-column>
                <el-table-column
                        prop="position"
                        label="职位">
                </el-table-column>
                <el-table-column
                        prop="pay"
                        label="薪资">
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="工作地点">
                </el-table-column>
                <el-table-column
                        prop="experience"
                        label="经验">
                </el-table-column>
                <el-table-column
                        prop="company"
                        label="公司">
                </el-table-column>
                <el-table-column
                        label="操作"
                        width="200">
                    <template slot-scope="scope">
                        <el-button type="text" size="medium">收藏</el-button>
                        <el-button type="text" size="medium">申请职位</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-tabs>
    </div>
</template>

<script>
    export default {
        name: 'showjob',
        data() {
            return {
                tableData: [{
                    position: 'java开发工程师',
                    pay: '12k-20k',
                    address: '广州',
                    experience: '本科',
                    company: '阿里巴巴'
                }],
                multipleSelection: []
            }
        },
        methods:{
            handleSelectionChange(val) {
                this.multipleSelection = val;
            }
        }
    }
</script>
<style>
    .showjob {
        width: 70%;
        margin-left: 15%;
        box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
        background-color: white;
    }

    .showjob-color {
        background-color: #F8EFEF;
        width: 100%;
    }
</style>
